<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Book Store</title>
<!--[if lt IE 9]>
	<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!--[if lt IE 9]>
	<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->
<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
		<meta charset="UTF-8">
			<meta name="viewport" content="initial-scale=1, maximum-scale=1">
				<meta name="viewport" content="width=device-width">
					<!-- Css Files Start -->
					<link href="css/style.css" rel="stylesheet" type="text/css" />
					<!-- All css -->
					<link href="css/bs.css" rel="stylesheet" type="text/css" />
					<!-- Bootstrap Css -->
					<link rel="stylesheet" type="text/css" href="css/main-slider.css" />
					<!-- Main Slider Css -->
					<!--[if lte IE 10]><link rel="stylesheet" type="text/css" href="css/customIE.css" /><![endif]-->

					<link href="css/font-awesome.css" rel="stylesheet" type="text/css" />

					<!-- Font Awesome Css -->
					<link href="css/font-awesome-ie7.css" rel="stylesheet"
						type="text/css" />
					<!-- Font Awesome iE7 Css -->
					<noscript>
						<link rel="stylesheet" type="text/css" href="css/noJS.css" />
					</noscript>
					<!-- Css Files End -->
</head>
<body>
	<!-- Start Main Wrapper -->
	<div class="wrapper">
		<!-- Start Main Header -->
		<!-- Start Top Nav Bar -->
		<section class="top-nav-bar"> <section class="container-fluid container"> 
			<section class="row-fluid"> <section class="span6 e-commerce-list">
		<ul>
			<li>Bem Vindo ao nosso site! <a href="checkout.html">Fazer
					Login</a> ou <a href="checkout.html">Criar Conta</a></li>
		</ul>
		</section> </section> </section> </section>
		<!-- End Top Nav Bar -->
		<header id="main-header"> <section
			class="container-fluid container"> <section
			class="row-fluid"> <section class="span4">
		<h1 id="logo">
			<a href="grid-view.html"><img src="images/logo.png" /></a>
		</h1>
		</section> <section class="span8">
		<div class="search-bar">
			<input name="" type="text" value="Procue o seu livro aqui..." /> <input
				name="" type="button" value="Serach" />
		</div>
		</section> </section> </section> <!-- Start Main Nav Bar --> <nav id="nav">
		<div class="navbar navbar-inverse">
			<div class="navbar-inner">
				<button type="button" class="btn btn-navbar" data-toggle="collapse"
					data-target=".nav-collapse">
					<span class="icon-bar"></span> <span class="icon-bar"></span> <span
						class="icon-bar"></span>
				</button>
				<div class="nav-collapse collapse">
					<ul class="nav">
						<li><a href="grid-view.html">Livros</a></li>
						<li class="dropdown"><a class="dropdown-toggle"
							href="grid-view.html" data-toggle="dropdown">Géneros<b
								class="caret"></b>
						</a>
							<ul class="dropdown-menu">
								<li><a href="about-us.html">Romance</a></li>
								<li><a href="blog.html">Policial</a></li>
								<li><a href="blog-detail.html">Drama</a></li>
								<li><a href="blog-detail.html">Ficção Científica</a></li>
								<li><a href="grid-view.html">História</a></li>
								<li><a href="list-view.html">Escolares</a></li>
								<li><a href="grid-view-without-side-bar.html">Universitários</a></li>
								<li><a href="shortcodes.html">Infantil</a></li>
								<li><a href="grid-view-without-side-bar.html">Aventura</a></li>
								<li><a href="grid-view-without-side-bar.html">Biografias</a></li>
							</ul></li>
						<li><a href="grid-view.html">Editoras</a></li>
						<li><a href="grid-view.html">Autores</a></li>
						<li><a href="grid-view.html">Promoções</a></li>
						<li><a href="grid-view.html">Ajuda</a></li>
					</ul>
				</div>
				<!--/.nav-collapse -->
			</div>
			<!-- /.navbar-inner -->
		</div>
		<!-- /.navbar --> </nav> <!-- End Main Nav Bar --> </header>
		<!-- End Main Header -->
		<!-- Start Main Content Holder -->
		<section id="content-holder" class="container-fluid container">
		<section class="row-fluid">
		<div class="heading-bar">
			<h2>Crie a sua conta</h2>
			<span class="h-line"></span>
		</div>
		<!-- Start Main Content --> <section class="checkout-holder">
		<section class="span9 first"> <!-- Start Accordian Section -->
		<div class="accordion" id="accordion2">

			<div class="accordion-group">
				<div class="accordion-heading">
					<a class="accordion-toggle" data-toggle="collapse"
						data-parent="#accordion2" href="#collapseOne"> Dados do
						utilizador </a>
				</div>
				<div id="collapseOne" class="accordion-body collapse in">
					<div class="accordion-inner">
						<strong class="green-t">Registo</strong>

						<!-- CONNECT WITH BD ACTION:NAMECLASS -->
						<form class="form-horizontal" action="Register" method="post">
							<ul class="billing-form">
								<li>
									<div class="control-group">
										<label class="control-label" for="inputFirstname">Primeiro
											nome <sup>*</sup>
										</label>
										<div class="controls">
											<input type="text" id="inputFirstname" name="FirstName"
												placeholder="">
										</div>
									</div>
									<div class="control-group">
										<label class="control-label" for="inputLastname">Último
											nome<sup>*</sup>
										</label>
										<div class="controls">
											<input type="text" id="inputLastname" name="LastName"
												placeholder="">
										</div>
									</div>

								</li>
								<li>

									<div class="control-group">
										<label class="control-label" for="inputEmail">Email<sup>*</sup></label>
										<div class="controls">
											<input type="text" id="inputEmail" name="email"
												placeholder="">
										</div>
									</div>
								</li>
								<li>
									<div class="control-group">
										<label class="control-label" for="inputAddress">Address<sup>*</sup></label>
										<div class="controls">
											<input type="text" id="inputAddress" placeholder=""
												class="address-field">
										</div>
									</div>
								</li>
								<li>
									<div class="control-group">
										<label class="control-label" for="inputCity">City <sup>*</sup></label>
										<div class="controls">
											<input type="text" id="inputCity" placeholder="">
										</div>
									</div>

								</li>
								<li>
									<div class="control-group">
										<label class="control-label" for="inputZip">Zip/Postal
											Code <sup>*</sup>
										</label>
										<div class="controls">
											<input type="text" id="inputZip" placeholder="">
										</div>
									</div>

								</li>
								<li>
									<div class="control-group">
										<label class="control-label" for="inputTelephone">Telefone
											<sup>*</sup>
										</label>
										<div class="controls">
											<input type="text" id="inputTelephone" name="telNumber"
												placeholder="">
										</div>

									</div>

								</li>
								<li>
									<div class="control-group">
										<div class="controls">
											<strong class="green-t">* PREENCHIMENTO OBRIGATÓRIO</strong>

										</div>
									</div>
								</li>

								<li>
									<div class="control-group">
										<div class="controls">
											<button type="submit" class="more-btn" value="Register">Finalizar</button>
										</div>
									</div>
								</li>


							</ul>
						</form>
					</div>
				</div>
			</div>


			<!-- 	COMENTEI SO PARA TESTAR, COLOQUEI BOTAO DE FINALIZAR , RETIRAR EM CIMA E DEIXAR O DE BAIXO
            <div class="accordion-group">
              <div class="accordion-heading"> <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseFifth"> Informação de Pagamento </a> </div>
              <div id="collapseFifth" class="accordion-body collapse">
                <div class="accordion-inner">
                	<form class="form-horizontal">
                        <ul class="billing-form">
                            <li>   
                            	
                              <div class="control-group">
                                <label class="control-label" for="inputCardname">Nome no Cartão<sup>*</sup></label>
                                <div class="controls">
                                  <input type="text" id="inputCardname" placeholder="">
                                </div>
                              </div>
                            </li>
                            <li>   
                              <div class="control-group">
                                <label class="control-label" for="inputCardtype">Tipo de Cartão <sup>*</sup></label>
                                <div class="controls">
                                  <select name="state" size="1">
                                    <option selected value="">Please select one</option>
                                    <option selected value="">Please select Two</option>
                                    <option selected value="">Please select Three</option>
                                  </select>
                                </div>
                              </div>
                            </li>                            
                            <li>   
                              <div class="control-group">
                                <label class="control-label" for="inputCreditcardnum">Número de Cartão  <sup>*</sup></label>
                                <div class="controls">
                                  <input type="text" id="inputCreditcardnum" placeholder="">
                                </div>
                              </div>
                              
                            </li>
                            <li>
                            	<div class="control-group w-extra">
                                <label class="control-label" for="inputExpirationdate">Data de expiração<sup>*</sup></label>
                                <div class="controls">
                                  <select name="state" size="1" class="month-list">
                                    <option selected value="">Month</option>
                                    <option selected value="">Month</option>
                                    <option selected value="">Month</option>
                                  </select>
                                  <select name="state" size="1" class="year-list">
                                    <option selected value="">Year</option>
                                    <option selected value="">Year</option>
                                    <option selected value="">Year</option>
                                  </select>
                                </div>
                              </div>
                            </li>
                            <li>   
                              <div class="control-group">
                                
                                <div class="controls">
                                  <input type="text" id="inputCardVerification" placeholder="">
                                  <strong class="green-t">* PREENCHIMENTO OBRIGATÓRIO</strong>
                                </div>
                              </div>
                            </li>
                        	<li>
                            	<div class="control-group">
                                <div class="controls">
                                  <button type="submit" class="more-btn">Finalizar</button>
                                </div>
                              </div>
                            </li>
                        </ul>
                    </form>
                </div>
             !</div>
            </div>
            -->
		</div>
		<!-- End Accordian Section --> </section> </section> <!-- End Main Content --> </section> </section>
		<!-- End Main Content Holder -->
		<!-- Start Footer Top 1 -->
		<section class="container-fluid footer-top1"> <section
			class="container"> <section class="row-fluid"> <figure
			class="span3">
		<h4>Newsletter</h4>
		<p>Subscribe to be the first to know about Best Deals and
			Exclusive Offers!</p>
		<input name="" type="text" class="field-bg" value="Enter Your Email" />
		<input name="" type="submit" value="Subscribe" class="sub-btn" /> </figure> <figure
			class="span3">
		<h4>Twitter</h4>
		<ul class="tweets-list">
			<li>Bookshoppe’- WooCommerce theme by crunchpress http<a
				href="#">://z.8o/XcexW23Q #envato</a></li>
			<li>Bookshoppe’- WooCommerce theme by crunchpress http<a
				href="#">://z.8o/XcexW23Q #envato</a></li>
		</ul>
		</figure> <figure class="span3">
		<h4>Location</h4>
		<p>5/23, Loft Towers, Business Center, 6th Floor, Media City,
			Dubai.</p>
		<span>
			<ul class="phon-list">
				<li>(971) 438-555-314</li>
				<li>(971) 367-252-333</li>
			</ul>
		</span> <span class="mail-list"> <a href="#">info@companyname</a><br />
			<a href="#">jobs@companyname.com</a>
		</span> </figure> <figure class="span3">
		<h4>Opening Time</h4>
		<p>Monday-Friday ______8.00 to 18.00</p>
		<p>Saturday ____________ 9.00 to 18.00</p>
		<p>Sunday _____________10.00 to 16.00</p>
		<p>Every 30 day of month Lorem ipsum dolor sit amet, consectetur
			adipiscing elit.</p>
		</figure> </section> </section> </section>
		<!-- End Footer Top 1 -->
		<!-- Start Footer Top 2 -->
		<section class="container-fluid footer-top2"> <section
			class="social-ico-bar"> <section class="container">
		<section class="row-fluid">
		<div id="socialicons" class="hidden-phone">
			<a id="social_linkedin" class="social_active" href="#"
				title="Visit Google Plus page"><span></span></a> <a
				id="social_facebook" class="social_active" href="#"
				title="Visit Facebook page"><span></span></a> <a id="social_twitter"
				class="social_active" href="#" title="Visit Twitter page"><span></span></a>
			<a id="social_youtube" class="social_active" href="#"
				title="Visit Youtube"><span></span></a> <a id="social_vimeo"
				class="social_active" href="#" title="Visit Vimeo"><span></span></a>
			<a id="social_trumblr" class="social_active" href="#"
				title="Visit Vimeo"><span></span></a> <a id="social_google_plus"
				class="social_active" href="#" title="Visit Vimeo"><span></span></a>
			<a id="social_dribbble" class="social_active" href="#"
				title="Visit Vimeo"><span></span></a> <a id="social_pinterest"
				class="social_active" href="#" title="Visit Vimeo"><span></span></a>
		</div>
		<ul class="footer2-link">
			<li><a href="about-us.html">About Us</a></li>
			<li><a href="contact.html">Customer Service</a></li>
			<li><a href="order-recieved.html">Orders Tracking</a></li>
		</ul>
		</section> </section> </section> </section>
		<!-- End Footer Top 2 -->
		<!-- Start Main Footer -->
		<footer id="main-footer"> <section class="social-ico-bar">
		<section class="container"> <section class="row-fluid">
		<article class="span6">
		<p>© 2013 BookShoppe’ - Premium WooCommerce Theme.</p>
		</article> <article class="span6 copy-right">
		<p>
			Designed by <a href="http://www.crunchpress.com/">Crunchpress.com</a>
		</p>
		</article> </section> </section> </section> </footer>
		<!-- End Main Footer -->
	</div>
	<!-- End Main Wrapper -->
	<!-- JS Files Start -->
	<script type="text/javascript" src="js/lib.js"></script>
	<!-- lib Js -->
	<script type="text/javascript" src="js/modernizr.js"></script>
	<!-- Modernizr -->
	<script type="text/javascript" src="js/easing.js"></script>
	<!-- Easing js -->
	<script type="text/javascript" src="js/bs.js"></script>
	<!-- Bootstrap -->
	<script type="text/javascript" src="js/bxslider.js"></script>
	<!-- BX Slider -->
	<script type="text/javascript" src="js/input-clear.js"></script>
	<!-- Input Clear -->
	<script src="js/range-slider.js"></script>
	<!-- Range Slider -->
	<script src="js/jquery.zoom.js"></script>
	<!-- Zoom Effect -->
	<script type="text/javascript" src="js/bookblock.js"></script>
	<!-- Flip Slider -->
	<script type="text/javascript" src="js/custom.js"></script>
	<!-- Custom js -->
	<script type="text/javascript" src="js/social.js"></script>
	<!-- Social Icons -->
	<!-- JS Files End -->
	<noscript>
		<style>
#socialicons>a span {
	top: 0px;
	left: -100%;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

#socialicons>ahover div {
	left: 0px;
}
</style>
	</noscript>
	<script type="text/javascript">
		/* <![CDATA[ */
		$(document).ready(function() {
			$('.social_active').hoverdir({});
		})
		/* ]]> */
	</script>
</body>
</html>
